angular.module('fs.waf').controller('poi.demo.fsTextController', [
  '$scope',
  '$q',
  function($scope, $q) {
    var config = {
      name: 'text',
      size: 4,
      type: 'text',
      model: 'textDemoValue',
      showStyle: 'edit',
      appScope: $scope,
      placeholder: 'text',
      tooltip: 'text'
    };

    var ctrl = this;

    ctrl.ngModel = {
      textDemoValue: 'this is a fsText component'
    };

    ctrl.normalData = [
      {
        value: 123,
        display: 'Jack'
      },
      {
        value: 456,
        display: 'Lee'
      }
    ];

    ctrl.hasPrefix = {};
    angular.extend(ctrl.hasPrefix, config, {
      label: 'hasPrefix',
      prefix: 'T'
    });

    ctrl.hasPattern = {};
    angular.extend(ctrl.hasPattern, config, {
      label: 'hasPattern',
      patternOptions: {
        active: true,
        data: ctrl.normalData
      }
    });

    ctrl.layoutConfig = {
      demo: {
        name: 'demo',
        gridGroups: [
          {
            grids: ['edit', 'readonly', 'view']
          },
          {
            grids: ['patternOptionsIsString', 'vm_data']
          },
          {
            grids: ['hasPattern', 'valueText', 'displayText', 'changeData']
          }
        ],
        gridConfigs: {
          valueText: {
            name: 'text',
            label: 'value',
            size: 2,
            type: 'text',
            model: 'textValue',
            appScope: $scope,
            showStyle: 'edit',
            tooltip: 'value'
          },
          displayText: {
            name: 'text',
            label: 'display',
            size: 2,
            type: 'text',
            model: 'displayText',
            appScope: $scope,
            showStyle: 'edit',
            tooltip: 'display',
            uppercase: false
          },
          changeData: {
            name: 'button',
            label: 'changeData',
            size: 2,
            type: 'button',
            appScope: $scope,
            text: 'Add Data',
            tooltip: 'button tooltip',
            options: {
              icon: 'setup',
              showIcon: false,
              callback: {
                click: 'vm.changeData'
              }
            }
          },
          edit: {
            name: 'text',
            label: 'edit',
            size: 4,
            type: 'text',
            model: 'textDemoValue',
            appScope: $scope,
            showStyle: 'edit',
            placeholder: 'text',
            tooltip: 'text'
          },
          readonly: {
            name: 'text',
            label: 'readonly',
            size: 4,
            type: 'text',
            model: 'textDemoValue',
            appScope: $scope,
            showStyle: 'readonly',
            placeholder: 'text',
            tooltip: 'text'
          },
          view: {
            name: 'text',
            label: 'view',
            size: 4,
            type: 'text',
            model: 'textDemoValue',
            appScope: $scope,
            showStyle: 'view',
            placeholder: 'text',
            tooltip: 'text'
          },
          patternOptionsIsString: {
            name: 'text',
            label: 'patternOptionsIsString',
            size: 4,
            type: 'text',
            model: 'textDemoValue',
            appScope: $scope,
            showStyle: 'edit',
            placeholder: 'text',
            tooltip: 'text',
            patternOptions: 'vm.patternOptions'
          },
          vm_data: {
            name: 'text',
            label: 'vm_data',
            size: 4,
            type: 'text',
            model: 'textDemoValue',
            appScope: $scope,
            showStyle: 'edit',
            placeholder: 'text',
            tooltip: 'text',
            patternOptions: {
              active: true,
              data: ctrl.normalData
            }
          },
          hasPrefix: ctrl.hasPrefix,
          hasPattern: ctrl.hasPattern
        }
      }
    };

    ctrl.patternOptions = {
      active: true,
      data: [
        {
          value: 123,
          display: 'Jack'
        },
        {
          value: 456,
          display: 'Lee'
        }
      ]
    };

    ctrl.componentStyle = [
      {
        value: 'edit',
        display: 'edit'
      },
      {
        value: 'readonly',
        display: 'readonly'
      },
      {
        value: 'view',
        display: 'view'
      }
    ];

    ctrl.changeData = function() {
      if (ctrl.ngModel.textValue && ctrl.ngModel.displayText) {
        ctrl.normalData.push({
          value: ctrl.ngModel.textValue,
          display: ctrl.ngModel.displayText
        });
      }
    };

    ctrl.clickFun = function() {
      console.log(ctrl.ngModel.linkValue);
    };
  }
]);
